<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
<title>开饭啦外卖平台</title>
<link rel="stylesheet" type="text/css" href="/css/vendors.css">
</head>
<body class="vertical-layout vertical-menu 2-columns   menu-expanded fixed-navbar" data-open="click" data-menu="vertical-menu" data-color="bg-gradient-x-purple-blue" data-col="2-columns">
<nav class="header-navbar navbar-expand-md navbar navbar-with-menu navbar-without-dd-arrow fixed-top navbar-semi-light">
  <div class="navbar-wrapper">
    <div class="navbar-container content">
      <div class="collapse navbar-collapse show" id="navbar-mobile">
        <ul class="nav navbar-nav mr-auto float-left">
          <li class="nav-item mobile-menu d-md-none mr-auto"><a class="nav-link nav-menu-main menu-toggle hidden-xs" href="javascript:;"><i class="ft-menu font-large-1"></i></a></li>
          <li class="nav-item d-none d-md-block"><a class="nav-link nav-menu-main menu-toggle hidden-xs" href="javascript:;"><i class="ft-menu"></i></a></li>
          <li class="nav-item dropdown navbar-search"><a class="nav-link dropdown-toggle hide" data-toggle="dropdown" href="javascript:;"><i class="ficon ft-search"></i></a>
            <ul class="dropdown-menu">
              <li class="arrow_box">
                <form>
                  <div class="input-group search-box">
                    <div class="position-relative has-icon-right full-width">
                      <input class="form-control" id="search" type="text" placeholder="Search here...">
                      <div class="form-control-position navbar-search-close"><i class="ft-x"></i></div>
                    </div>
                  </div>
                </form>
              </li>
            </ul>
          </li>
        </ul>
        <ul class="nav navbar-nav float-right">
          <li class="dropdown dropdown-user nav-item"> <a class=" nav-link dropdown-user-link" href="login.html" > <span class="username"><i class="ft-power"></i>退出登录</span> </a> </li>
          <li class="dropdown dropdown-user nav-item"> <a class="dropdown-toggle nav-link dropdown-user-link" href="javascript:;" > <span class="username">Admin</span> <span class="avatar avatar-online"><img src="/images/avatar-s-19.png" alt="avatar"></span> </a> </li>
        </ul>
      </div>
    </div>
  </div>
</nav>
<div class="main-menu menu-fixed menu-light menu-accordion    menu-shadow " data-scroll-to-active="true" >
  <div class="navbar-header">
    <ul class="nav navbar-nav flex-row">
      <li class="nav-item mr-auto"><a class="navbar-brand" href="index.html"><img class="brand-logo" alt="Chameleon admin logo" src="/images/logo.jpg"/>
        <h3 class="brand-text">开饭啦外卖平台</h3>
        </a></li>
      <li class="nav-item d-md-none"><a class="nav-link close-navbar"><i class="ft-x"></i></a></li>
    </ul>
  </div>
  <div class="main-menu-content">
    <ul class="navigation navigation-main" id="main-menu-navigation" data-menu="menu-navigation">
        <li class=" nav-item active"><a th:href="@{/store/index}"><i class="ft-home"></i><span class="menu-title">首页</span></a></li>
      <li class=" nav-item"><a href="javascript:;"><i class="la la-medkit"></i><span class="menu-title"> 菜品中心</span></a>
        <ul class="menu-content">
          <li><a th:href="@{/store/goods}">菜品管理</a> </li>
          <li><a th:href="@{/store/goods/0}">菜品添加</a> </li>
        </ul>
      </li>
        <li class=" nav-item"><a href="javascript:;"><i class="ft-users"></i><span class="menu-title"> 商家信息</span></a>
            <ul class="menu-content">
                <li><a th:href="@{/store}">商家信息管理</a> </li>
            </ul>
        </li>
      <li class=" nav-item"><a href="javascript:;"><i class="ft-layout"></i><span class="menu-title">菜品分类</span></a>
        <ul class="menu-content">
            <li><a th:href="@{/store/classify}">菜品分类管理</a> </li>
            <li><a th:href="@{/store/classify/0}">菜品分类添加</a> </li>
        </ul>
      </li>
      <li class=" nav-item"><a href="javascript:;"><i class="ft-file-text"></i><span class="menu-title">商家订单</span></a>
        <ul class="menu-content">
            <li><a th:href="@{/store/order}">商家接单管理</a> </li>
        </ul>
      </li>
    </ul>
  </div>
  <div class="navigation-background"></div>
</div>
<div class="app-content content">
    <div class="content-wrapper">
        <div class="content-wrapper-before"></div>
        <div class="content-header row">
            <div class="content-header-left col-md-4 col-12 mb-2">
                <h3 class="content-header-title">菜品主页</h3>
            </div>
            <div class="content-header-right col-md-8 col-12">
                <div class="breadcrumbs-top float-md-right">
                    <div class="breadcrumb-wrapper mr-1">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a th:href="@{/store/index}">主页</a></li>
                            <li class="breadcrumb-item"><a href="javascript:;">菜品管理</a></li>
                            <li class="breadcrumb-item active">菜品主页</li>
                        </ol>
                    </div>
                </div>
            </div>
        </div>
        <div class="content-body">
            <section class="file-browser">
                <div class="card" style="">
                    <div class="card-header">
                        <label th:text="${null != goods.goodsId ? '修改菜品' : '添加菜品'}">添加菜品</label>
                    </div>
          <div class="iq-card-body">
              <div class="topbtn">
                  <a th:href="@{/store/goods}" class="btn btn-info">返回菜品列表</a>
              </div>
              <form id="goodsForm" name="goodsForm" th:action="@{/store/goods}" method="post">
                  <!-- 第二步：在form表单中添加input输入框，来告诉SrpingBoot 提交什么请求方式（put，delete）
                   name=“—_method” 固定写法，value 属性指定的是我们要期望提交的请求方式：put,delete-->
                  <input type="hidden" name="_method" value="PUT" th:if="${null != goods.goodsId}">
                  <input type="hidden" name="goodsId" th:value="${goods.goodsId}" th:if="${null != goods.goodsId}">
                  <span style="color: red;" th:text="${null !=errors ? errors['goodsId']:''}"></span>
                  <div class="inputbox" style="width: 100%; max-width: 1100px; margin: 0 auto;">

                      <ul class="row">
                          <li class="col-md-9">
                              <div>
                                  <ul class="row">
                                      <li class=" col-md-4">
                                          <h5 class="mt-2">菜品名称</h5>
                                          <fieldset class="form-group">
                                              <input type="text" class="form-control" name="goodsName" th:value="${goods.goodsName}">
                                              <span style="color: red;" th:text="${null !=errors ? errors['goodsName']:''}"></span>
                                          </fieldset>
                                      </li>
                                          <li class=" col-md-4">
                                              <h5 class="mt-2">菜品库存</h5>
                                              <fieldset class="form-group">
                                                  <input type="text" class="form-control" name="goodsInventory" th:value="${goods.goodsInventory}">
                                              </fieldset>
                                          </li>
                                      <li class=" col-md-4">
                                          <h5 class="mt-2">菜品价格</h5>
                                          <fieldset class="form-group">
                                              <input type="text" class="form-control" name="goodsPrice" th:value="${goods.goodsPrice}">
                                          </fieldset>
                                      </li>
                                      <li class=" col-md-4">
                                          <h5 class="mt-2">菜品分类</h5>
                                              <select id="goodsClassify" name="goodsClassify" class="form-control "  >
                                                  <option value="">--请选择菜品类型--</option>
                                                  <option th:each="classify, stat : ${classifyList}" th:value="${classify.classifyId}" th:text="${classify.classifyName}"
                                                  th:selected="${classify.classifyId == goods.goodsClassifyId}"></option>
                                              </select>
                                      </li>
                                      <li class="col-md-12">
                                          <h5 class="mt-2">菜品简介</h5>
                                          <fieldset class="form-group">
                                              <textarea class="form-control" rows="5" name="goodsIntroduce" th:text="${goods.goodsIntroduce}">菜品简介</textarea>
                                          </fieldset>
                                      </li>
                                      </li>
                                  </ul>
                              </div>
                          </li>
                          <li class="col-md-3">
                              <div class="headedit text-center">
                              <strong>菜品图片</strong>
                              <div class="imgbox">
                                  <!--保存图片地址-->
                                  <input type="hidden" name="goodsHeadImage" id="goodsHeadImage" th:value="${goods.goodsHeadImage}"/>
                                  <!--显示头像 -->
                                  <img class="roundimg" th:src="@{${goods.goodsHeadImage}}" width="120" name="imgGoodsHeadImage" id="imgGoodsHeadImage">
                              </div>
                              <!--点击此a标签弹出选择文件对话框 -->
                              <a href="javascript:;" id="aImagefile" onclick="toOpenFile()" class="btn upbtn btn-default btn-sm">
                                  <i class="ft-upload-cloud "></i>
                                  <label th:text="${null != goods.goodsId ? '修改图片' : '添加图片'}">添加图片</label>
                              </a>
                              <!--用于上传图片选择文件的控件 -->
                              <input type="file" style="display: none" name="imagefile" id="imagefile" onchange="uploadImage()"/>

                          </div>
                          </li>
                      </ul>
                  </div>

                  <div class="text-center">
                    <button class="btn btn-primary" type="submit">确认提交</button>
                </div>
              </form>
					</div>

                </div>

      </section>
    </div>
  </div>
</div>
<footer class="footer footer-static footer-light navbar-border navbar-shadow">
  <div class="clearfix blue-grey lighten-2 text-sm-center mb-0 px-2"><span class="float-md-left d-block d-md-inline-block">2022  &copy; Copyright 开饭啦外卖平台 © 2022-2023</span>
    <ul class="list-inline float-md-right d-block d-md-inline-blockd-none d-lg-block mb-0">
      <li class="list-inline-item">开饭啦外卖平台</li>
    </ul>
  </div>
</footer>

<!-- BEGIN VENDOR JS--> 
<script src="/js/vendors.min.js" type="text/javascript"></script>
<script src="/js/app-menu.js" type="text/javascript"></script>
<script src="/js/app.js" type="text/javascript"></script>
<script src="/js/echarts.min.js" type="text/javascript"></script>
<script src="/laydate/laydate.js" type="text/javascript"></script>
<<script th:src="@{/js/takeout/goods.js}" ></script>
<script th:src="@{/js/common-search.js}" ></script>
<script th:src="@{/js/toastr.js}"></script>
<script>
lay('#version').html('-v'+ laydate.v);
laydate.render({
    elem: '#date'
//  ,range: true
  ,theme: '#6967ce'
});
</script> 

</body>
</html>